import "@antv/x6-plugin-minimap/dist/index.css"
import { ref } from "vue"
import { MiniMap } from '@antv/x6-plugin-minimap'
import Main from "../main";
import MinimapEl from "../component/minimap.vue";

export default (main:Main) => {
    const enabled = ref(false);
    //
    const visible = ref(true);
    const toggle = (bool?:boolean) => {
        visible.value = bool == undefined ? !visible.value : bool;
    }
    //
    const options = {width:400,height:200,padding:10}
    const initOptions = (ops:any = {}) => {
        Object.assign(options,ops)
    }
    //
    const init = (box:HTMLDivElement) => {
        const plug = new MiniMap({container:box,...options})
        if(main.graph.use != undefined && typeof main.graph.use == 'function'){
            main.graph.use(plug)
        }else{
            main.graph.onMounted((graph) => graph.use(plug))
        }
    }

    

    return {
        enabled,
        Minimap:MinimapEl,
        props:{visible,init,time:main.graph.initTime},
        initOptions,
        toggle
    }
}